<template>
    <div class="transfer-container">
        <div class="transfer-title">ETH转账</div>
        <div class="form-item">
            <label>接收人地址:</label>
            <div class="col-s-100 form-item-address">
                <el-input placeholder=""></el-input>
                <div class="fa fa-address" @click="linkman()"></div>
            </div>
        </div>
        <div class="form-item">
            <label>转账金额:</label>
            <div class="col-s-100 form-item-float clearfix">
                <div class="form-item-amount">
                    <el-input placeholder=""></el-input>
                </div>
                <div class="form-item-select">
                    <el-select v-model="value" placeholder="请选择" >
                        <el-option
                                v-for="item in options"
                                :key="item.value"
                                :label="item.label"
                                :value="item.value">
                        </el-option>
                    </el-select>
                </div>
            </div>
        </div>
        <div class="form-item">
            <label>备注:</label>
            <div class="col-s-100">
                <el-input placeholder=""></el-input>
            </div>
        </div>
        <el-button type="primary" class="btn-big btn-top" @click="next()">下一步</el-button>
    </div>
</template>
<script>
    export default {
        data(){
            return {
                options: [{
                    value: '1',
                    label: 'ETH'
                }, {
                    value: '2',
                    label: 'CNY'
                }, {
                    value: '3',
                    label: 'EWT'
                }, {
                    value: '4',
                    label: 'HHH'
                }, {
                    value: '5',
                    label: 'RMB'
                }],
                value: '1'
            }
        },
        methods:{
            next(){
                this.$router.push({path:'/home/auth'})
            },
            linkman(){
                this.$router.push({path:'/home/linkman'})
            }
        }
    }
</script>
<style>
    .transfer-container{
        width: 600px;
        height: auto;
        margin: 0 auto;
    }
    .transfer-container .transfer-title{
        text-align: center;
        padding: 30px 0;
        font-size: 15px;
    }
    .form-item{
        margin-bottom: 20px;
    }
    .form-item label{
        margin-bottom: 20px;
        display: block;
        font-size: 15px;
    }
    .form-item .form-item-address{
        position: relative;
    }
    .form-item .col-s-100 input{
        width: 100%;
        background: transparent;
        font-size: 14px;
    }
    .form-item .form-item-address input{
        padding: 10px 40px 10px 10px;
    }
    .form-item .form-item-address .fa{
        position: absolute;
        right: 5px;
        top: 8px;
    }
    .fa-address{
        display: inline-block;
        width: 25px;
        height: 25px;
        background: url("../../assets/home/friends.png") no-repeat center;
        background-size: 100%;
        cursor: pointer;
    }
    .form-item .form-item-float > div{
        float: left;
    }
    .transfer-container .form-item .col-s-100 .form-item-amount input{
        width: 440px;
    }
    .form-item .form-item-select{
        margin-left: 20px;
    }
    .transfer-container .form-item .form-item-select .el-input{
        width: 140px;
    }
    .btn-top{
        margin-top: 40px;
    }
</style>